.extension{
    overflow: hidden;
    .minwidth();
    .extensionheader{
        // background-color: #3A80F4;
        background-image: url(../assets/img/invite-bg.png);
        background-size: 100% 100%;
        height: 235px;
        .headercon{
            .widthmargin();
            color: #ffffff;
            h2{
                font-size:32px;
                font-weight: bold;
                padding-top: 56px;
            }
            h3{
                margin-top: 25px;
                font-size:18px;
            }
        }
    }
    .shareheader{
        .widthmargin();
        box-shadow:0px 0px 16px 4px rgba(0, 0, 0, 0.1);
        position: relative;
        top: -50px;
        z-index: 100;
        border-radius: 25px;
        overflow: hidden;
        .cont{
            .display();
            li{
                .display();
                height: 160px;
            }
            .commission{
                width: 469px;
                background-color: #182330;
                .h2{
                    // width: 50%;
                    flex: 1;
                    color: #fff;
                    padding-top: 45px;
                    .title{
                        font-size:36px;
                        font-weight:bold;
                    }
                    .text{
                        margin-top: 25px;
                        font-size:18px;
                        color: #666;
                    }
                }
            }
            .share{
                width: 811px;
                background-color: #131C28;
                .list{
                    img{
                        display: inline-block;
                        width:125px;
                        height:125px;
                        margin-top: 18px;
                        margin-left: 25px;
                        margin-right: 25px;
                    }
                    .title{
                        font-size:16px;
                        color: #ccc;
                        padding-top: 25px;
                    }
                    span{
                        font-size:14px;
                        color: #fff;
                        padding-right: 100px;
                    }
                    .burt{
                        width:119px;
                        height:31px;
                        line-height: 31px;
                        font-size:14px;
                        color: #ffffff;
                        background-color: #3A80F4;
                        border-radius: 4px;
                        margin-top: 25px;
                    }
                    .click{
                        font-size:14px;
                        color: #3A80F4;
                    }
                    .click2{
                        cursor: pointer;
                    }
                }
            }
        }
    }
    .mainheader{
        .widthmargin();
        .cont{
            width: 248px;
            font-size:18px;
            color: #ccc;
            background-color: #131C28; 
            margin: 0 auto 25px auto;
            .list{
                width: 49%;
                // border: solid 1px #EFEFF4;
                border-radius:4px;
                display: inline-block;
                cursor: pointer;
                line-height: 38px;
            }
            .avat{
                background-color: #182330;
                color: #3A80F4;
            }
        }
    }

    .Myfriends, .Commissiondetails{
        padding-left: 25px;
        padding-right: 25px;
        .widthmargin();
        .el-table{
          background-color: #0A1017;
          th{
              background-color: #182330;
          }
        }
        .el-table--border::after, .el-table--group::after, .el-table::before{
          background-color: #243141;
        }
        .el-table td, .el-table th.is-leaf{
          border: none;
        }
    }
}